﻿window.officeWorldMapDemo = window.officeWorldMapDemo || {};

(function (app) {

    app.OfficeMap = function (container) {

        var self = this;

        self._domContainer = container;

        self._map = null;
        self._offices = [];
        self._currentOfficeInfoTip = null;

        self.loadOffices = function () {

            var imageUrl = "http://cdn3.iconfinder.com/data/icons/business-and-finance-icons/512/Office_Building-32.png";

            self._offices.push({
                x: 25.27202,
                y: 55.307922,
                title: "Dubai",
                description: "Technology, investment and manufacturing office.",
                imageUrl: imageUrl
            });
            self._offices.push({
                x: 40.713956,
                y: -74.00802,
                title: "New York",
                description: "Global sales office.",
                imageUrl: imageUrl
            });
            self._offices.push({
                x: 55.771939,
                y: 37.617188,
                title: "Moscow",
                description: "PR & Marketing.",
                imageUrl: imageUrl
            });
            self._offices.push({
                x: -33.890542,
                y: 151.274856,
                title: "Sydney",
                description: "Head Office.",
                imageUrl: imageUrl
            });
            self._offices.push({
                x: 22.352616,
                y: 114.158936,
                title: "Hong Kong",
                description: "Manufacturing, R&D offices.",
                imageUrl: imageUrl
            });
            self._offices.push({
                x: 51.495065,
                y: -0.134583,
                title: "London",
                description: "Tax & Legal offices.",
                imageUrl: imageUrl
            });
        };

        self.initMarker = function (officeLocation) {

            var officeMarker = new google.maps.Marker({
                position: new google.maps.LatLng(officeLocation.x, officeLocation.y),
                map: self._map,
                icon: officeLocation.imageUrl
            });

            var officeInfoTip = new google.maps.InfoWindow({
                content: officeLocation.description
            });

            google.maps.event.addListener(officeMarker, 'click', function () {

                if (self._currentOfficeInfoTip !== null)
                    self._currentOfficeInfoTip.close();

                officeInfoTip.open(self._map, officeMarker);
                self._currentOfficeInfoTip = officeInfoTip;
            });
        };

        self.initOfficeButton = function (container, officeLocation) {

            container.innerHTML = officeLocation.title;
            container.className = "office-btn";

            google.maps.event.addDomListener(container, 'click', function () {
                self._map.setZoom(8);
                self._map.setCenter(new google.maps.LatLng(officeLocation.x, officeLocation.y));
            });
        };

        self.initShortcut = function (officeLocation) {

            var officeBtn = document.createElement('div');

            self.initOfficeButton(officeBtn, officeLocation);
            self._map.controls[google.maps.ControlPosition.TOP_CENTER].push(officeBtn);
        };

        self.init = function () {

            var mapOptions = {
                zoom: 1,
                center: new google.maps.LatLng(0, 0),
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };

            self._map = new google.maps.Map(self._domContainer, mapOptions);

            self.loadOffices();

            for (var key in self._offices) {

                var currentOffice = self._offices[key];

                self.initMarker(currentOffice);
                self.initShortcut(currentOffice);
            }

            self._map.setCenter(new google.maps.LatLng(0, 0));
        };
    };

})(window.officeWorldMapDemo);


SP.SOD.notifyScriptLoadedAndExecuteWaitingJobs("spdevlab.gmaps.officemap.demo.js");
